//detailListFilter
import React, {PropTypes} from 'react'
import styles from './cms.less'

class BlockList extends React.Component {
  constructor(props) {
    super(props);
  }

  render() {
    let {itemInfo, list, baseUrl, keyField} = this.props;

    const createListItem = (item, index) => {
      return <div className={styles.listItem + ' ' + ((index % 2 ) == 0 ? styles.left : styles.right)} key={index}>
        {
          itemInfo.map((x, key) => {
            return <p key={key}>
              <b style={x.left.dataStyle || null}>
                {
                  key == 0 && baseUrl !== undefined ?
                    <a href={ baseUrl !== undefined ? baseUrl + item[keyField] : 'javascript:void(0)'}>
                      {
                        x.left.render ? x.left.render(item[x.left.dataIndex], item) : item[x.left.dataIndex]
                      }
                    </a>
                    :
                    x.left.render ? x.left.render(item[x.left.dataIndex], item) : item[x.left.dataIndex]
                }
              </b>
              {x.right.dataIndex ?
                <b>
                  {
                    x.right.render ? x.right.render(item[x.right.dataIndex]) : <span>{item[x.right.dataIndex]}</span>
                  }
                </b>
                : ''}
            </p>
          })
        }
      </div>
    }

    return <div className={styles.blockList}>
      {
        list.map((item, key) => {
          return createListItem(item, key)
        })
      }
    </div>
  }
}

BlockList.propTypes = {
  itemInfo: PropTypes.arrayOf(PropTypes.shape({
    left:PropTypes.shape({
      dataIndex: PropTypes.string.isRequired,
      render: PropTypes.func
    }),
    right:PropTypes.shape({
      dataIndex: PropTypes.string,
      render: PropTypes.func
    }),
  })).isRequired,
  list: PropTypes.array.isRequired,
  baseUrl: PropTypes.string,
  keyField: PropTypes.string,
};
export default BlockList

